<style>
    .my-publish-list {
        border-bottom: .25rem solid #f3f3f3;
    }

    .wallet-list {
        overflow: auto;
        height: 28rem;
        padding-bottom: 2rem;
        -webkit-overflow-scrolling : touch;
    }
    .service-fixed-wrap {
        padding: .5rem;
        background: #f3f3f3;
        border-radius: 50%;
        position: fixed;
        right: 1rem;
        bottom: 2rem;
    }
    .service-btn {
        width: 1rem;
        height: 1rem;
        display: block;
    }
</style>
<div class="find-app" id="app">
    <!-- public-head -->
    <div class="header-mobile">
        <a class="nav-back" @click="checkHistory">
            <img class="icon" src="__CDN__/assets/img/return@2x.png" alt="">
        </a>
        <h1 class="nav-title">我发布的</h1>
    </div>
    <!-- main -->
    <div class="main-wrapper">
        <!-- join-wrapper -->
        <div class="join-wrapper">
            <!-- floor-two -->
            <div class="section-floor">
                <div class="publish-wrapper">
                    <div class="publish-category">
                        <div :class="postData.type === 1?'cur':''" class="category-item"><a class="href-cover"
                                @click="navChange(1)">我发布的</a></div>
                        <div :class="postData.type === 2?'cur':''" class="category-item"><a class="href-cover"
                                @click="navChange(2)">已完成的</a></div>
                    </div>
                    <div class="wallet-list">
                        <mt-loadmore ref="loadmore" :bottom-method="loadBottom" :auto-fill="nofill"
                            @bottom-status-change="handleBottomChange">
                            <div class="my-publish-list" v-for="(item,index) in list" :key='index'>
                                <a :href="item.url">
                                    <div class="list-item">
                                        <div class="my-publish-head">
                                            <div class="time">{{item.createtime}}</div>
                                            <div class="status">{{item.status_name}}</div>
                                        </div>
                                        <div class="body">
                                            <div class="info-bar">
                                                <span class="label">{{item.label}}</span>
                                                {{item.content}}
                                            </div>

                                            <div class="gallery-bar">
                                                <div v-for="(subitem,subindex) in item.imageslist" :key="subindex"
                                                    class="gallery-item">
                                                    <img class="img" v-lazy="subitem" alt="">
                                                </div>
                                            </div>


                                            <div class="location-bar">
                                                <div>
                                                    <img class="icon" src="__CDN__/assets/img/icon-map@2x.png" alt="">
                                                    <span>{{item.detailedaddress}}</span>
                                                </div>
                                                <div>
                                                    <!--<span>分享 123</span>-->
                                                    <span>浏览 {{item.browse}}</span>
                                                </div>
                                            </div>
                                            <div class="reward-bar">
                                                <div class="inner">
                                                    <span class="reward">{{item.q_name}}</span>
                                                    <span class="symbol">￥</span>
                                                    <span class="price">{{item.money}}</span>
                                                </div>

                                                <div>

                                                    <a v-if="item.status == 1" @click="_delete(item.id)"
                                                        class="share-btn">删除</a>
                                                    <a v-if="item.status == 1" @click="delay(item.id)"
                                                        class="share-btn">延迟</a>
                                                    <a v-if="item.status == 0" @click="delay_del(item.id)"
                                                        class="share-btn">删除</a>

                                                    <a v-if="item.status == 0" @click="delay_play(item.id)"
                                                        class="share-btn">支付</a>


                                                </div>
                                            </div>
                                        </div>
                                        <div class="time-less-bar" v-if="item.status == 1">
                                            <span class="label">截止时间: </span><span class="time">{{item.deadline}}</span>
                                        </div>
                                </a>
                                <!-- 确认中 -->
                                <div v-if="item.receiverUserId" class="confirm-wrapper">
                                    <div class="confirm-list">
                                        <div class="list-item">
                                            <div class="head">
                                                <div class="user-info"  v-if="item.status >= 2">
                                                    <div>
                                                        <img class="avatar" :src="item.receiverUser.avatar" alt="">
                                                    </div>
                                                    <div>
                                                        <p class="name">{{item.receiverUser.nickname}}</p>
                                                        <p class="time">{{item.updatetime}}</p>
                                                    </div>
                                                </div>
                                                <a class="link-btn" v-if="item.status == 2 && item.publisherUserId == item.uid" :href="item.chat_url">联系Ta</a>
                                            </div>
                                            <div class="body" v-if="item.status >= 2">
                                                <div class="info-bar">
                                                    {{item.eurekaContent}}
                                                </div>
                                                <div class="gallery-bar">
                                                    <div v-for="(subitem,subindex) in item.eurekaimageslist"
                                                        :key="subindex" class="gallery-item">
                                                        <img class="img" v-lazy="subitem" alt="">
                                                    </div>
                                                </div>

                                            </div>
                                            <div class="footer">

                                                <!--<a v-if="item.status == 1" @click="_delete(item.id)" class="btn">删除</a>-->

                                                <a v-if="item.status == 2" @click="_refuse(item.id)" class="btn">拒绝</a>

                                                <!--<a v-if="item.status == 1" @click="delay(item.id)" class="btn">延迟</a>-->
                                                <a v-if="item.status == 2 && item.publisherUserId == item.uid"
                                                    @click="confirm_click(item.id)" class="btn">确认完成</a>

                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </mt-loadmore>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- public-toast -->
<div class="mask-mobile" v-if="Firend">
    <div class="toast-mobile">
        <div class="toast-wrapper">
            <div class="toast-head">
                <h1 class="title">温馨提示</h1>
                <div class="main">
                    <!-- <p class="txt">删除订单请消息客服{$service}</p> -->
                    <p v-if="toastType == 'delete'" class="txt">请关注微信公众号“一起帮爱心传递”，回复您想要删除的启事。</p>
                    <p v-else class="txt">请关注微信公众号“一起帮爱心传递”，回复您想要咨询的问题。</p>
                </div>
            </div>
            <div class="toast-footer">
                <a class="btn invite-btn" @click="Firend = false">取消</a>
                <a class="btn share-btn" @click="Firend = false">确认</a>
            </div>
        </div>
    </div>
</div>
<div class="service-fixed-wrap" @click="toastType = 'service';Firend = true">
    <img class="service-btn" src="__CDN__/assets/img/service.png" alt="">
</div>
<!-- delay-toast -->
<div v-if="toastDelayShow" class="mask-delay">
    <div class="toast-mobile">
        <div class="toast-wrapper">
            <div class="toast-head">
                <h1 class="title">延期天数</h1>
                <div class="main">
                    <mt-radio v-model="day" :options="options"></mt-radio>
                </div>
            </div>
            <div class="toast-footer">
                <a class="btn invite-btn" @click="toastDelayShow = false">取消</a>
                <a class="btn share-btn" @click="delay_click()">确认</a>
            </div>
        </div>
    </div>
</div>
</div>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript" charset="utf-8"></script>

<script>
    wx.config( <?php echo $js->config(array('chooseWXPay'), false) ?> );

    let index = new Vue({
        el: '#app',
        data: {
            toastType: '',
            list: [],
            loading: false,
            postData: {
                page: 1,
                limit: 10,
                RequestName: 1,
                type: 1
            },
            Firend: false,
            toastDelayShow: false,
            options: [{
                    label: '30天',
                    value: '1'
                },
                {
                    label: '永久',
                    value: '2'
                }
            ],
            day: '1',
            id: 0,
            bottomStatus: '',
            nofill: false
        },
        created() {
            // this.jumpDomain = "{:url('index/detail')}"
            this.ajax()
        },
        mounted() {
            // this.ajax()
            // this.wrapperHeight = document.documentElement.clientHeight - this.$refs.wrapper.getBoundingClientRect().top;
        },
        methods: {
            checkHistory() {
                if (window.history.length == 1) {
                    window.location.href = "{:url('index/index')}"
                } else if (window.history.length > 1) {
                    window.history.go(-1)
                } else {
                    window.history.go(-1)
                }
            },
            // 上拉加载事件
            loadBottom() {
                this.ajax()
            },
            // 触底事件
            handleBottomChange(status) {
                this.bottomStatus = status;
            },
            navChange(type) {
                this.postData.page = 1
                this.postData.type = type
                this.ajax(type);
            },
            ajax() {
                let self = this
                this.loading = true
                axios({
                    method: "post",
                    url: "{:url('user/mypublish')}",
                    data: self.postData,
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                }).then(res => {
                    if (self.postData.page == 1) {
                        self.list = [];
                    }
                    if (res.data.code == 1) {
                        self.list = self.list.concat(res.data.data)
                        self.postData.page++
                        self.loading = false
                    }
                    self.$refs.loadmore.onBottomLoaded();
                })
            },
            delete_click() {
                let self = this

                axios({
                    method: "post",
                    url: "{:url('user/mypublish')}",
                    data: {
                        RequestName: 4,
                        status: 4,
                        id: this.id
                    },
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                }).then(res => {

                    if (res.data.code == 1) {
                        this.$messagebox({
                            title: res.data.msg
                        }).then(rest => {
                            self.Firend = false
                            this.postData.page = 1
                            self.ajax(self.postData.type)
                        })
                    }
                })
            },
            confirm_click(id) {
                let self = this

                axios({
                    method: "post",
                    url: "{:url('user/mypublish')}",
                    data: {
                        RequestName: 3,
                        status: 3,
                        id: id
                    },
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                }).then(res => {

                    if (res.data.code == 1) {
                        this.postData.page = 1
                        self.$messagebox(res.data.msg)
                        self.ajax(self.postData.type)
                    }
                })
            },
            _delete(id) {
                this.toastType = 'delete'
                this.Firend = true
                this.id = id
            },
            _refuse(id) {
                let self = this
                axios({
                    method: "post",
                    url: "{:url('user/mypublish')}",
                    data: {
                        RequestName: 4,
                        status: 1,
                        id: id
                    },
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                }).then(res => {

                    if (res.data.code == 1) {
                        this.postData.page = 1
                        self.$messagebox('拒绝成功')
                        self.ajax(self.postData.type)
                    }
                })
            },
            delay(id) {
                this.id = id
                this.toastDelayShow = true
            },
            delay_click() {
                let self = this
                console.info(self.options)
                axios({
                    method: "post",
                    url: "{:url('user/mypublish')}",
                    data: {
                        RequestName: 2,
                        cycle: self.day,
                        id: self.id
                    },
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                }).then(res => {
                    if (res.data.code == 1) {
                        self.$messagebox({
                            title: res.data.msg
                        }).then(rest => {
                            self.toastDelayShow = false
                            self.postData.page = 1
                            self.ajax(self.postData.type)
                        })
                    }
                })
            },
            delay_del(id) {
                let self = this
                this.toastType = 'delete'
                axios({
                    method: "post",
                    url: "{:url('user/mypublish')}",
                    data: {
                        RequestName: 5,
                        id: id

                    },
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                }).then(res => {


                    if (res.data.code == 1) {
                        this.$messagebox({
                            title: res.data.msg
                        }).then(rest => {
                            this.postData.page = 1
                            self.ajax(self.postData.type)
                        })

                    }
                })
            },
            delay_play(id) {
                let self = this
                axios({
                    method: "post",
                    url: "{:url('user/mypublish')}",
                    data: {
                        RequestName: 6,
                        id: id

                    },
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                }).then(res => {
                    if (res.data.code == 1) {
                        self.$messagebox({
                            title: res.data.msg
                        }).then(rest => {
                            if (rest === 'confirm') {
                                var data = res.data.data;
                                wx.chooseWXPay({
                                    timestamp: data.timestamp,
                                    nonceStr: data
                                        .nonceStr, // 支付签名随机串，不长于 32 位
                                    package: data.package,
                                    signType: data.signType,
                                    paySign: data.paySign, // 支付签名
                                    success: function (res) {
                                        // 支付成功后的回调函数
                                        if (res.errMsg ==
                                            "chooseWXPay:ok") {
                                            axios({
                                                method: "post",
                                                url: "{:url('user/publish')}",
                                                data: {
                                                    RequestName: 'payment',
                                                    id: id
                                                },
                                                headers: {
                                                    'X-Requested-With': 'XMLHttpRequest'
                                                }
                                            }).then(res => {
                                                console.log('支付的回调')
                                                if (res.data.code === 1) {
                                                    self.postData.page = 1
                                                    console.log('支付成功刷新数据')
                                                    console.log(self.postData.type)
                                                    self.ajax(self.postData.type)
                                                }
                                            })
                                        } else {
                                            self.$messagebox("支付失败，请返回重试。");
                                        }
                                    },
                                    fail: function (res) {
                                        self.$messagebox("支付失败，请返回重试。");
                                    }
                                });
                                // history.go(-1);
                            }
                        })
                    }
                })
            }
        }
    })
</script>